<template>
    <div id='mainTabBar'>
       <tab-bar>
           <tab-bar-item path='/home'>
               <i class="iconfont icon-shouye" slot='item-iconfont'></i>
               <span slot='item-text'>首页</span>
           </tab-bar-item>
           <tab-bar-item path='/community'>
               <i class="iconfont" slot='item-iconfont'>&#xe600;</i>
               <span slot='item-text'>社区</span>
           </tab-bar-item>
           <tab-bar-item path='/message'>
               <i class="iconfont icon-xiaoxi1" slot='item-iconfont'></i>
               <span slot='item-text'>消息</span>
           </tab-bar-item>
           <tab-bar-item path='/profile'>
               <i class="iconfont icon-tubiaolunkuo-" slot='item-iconfont'></i>
               <span slot='item-text'>我的</span>
           </tab-bar-item>
       </tab-bar>
    </div>
</template>

<script>
    import TabBar from 'components/common/tabBar/TabBar'
    import TabBarItem from 'components/common/tabBar/TabBarItem'
    export default {
        name: '',
        data () {
            return {

            }
        },
        components: {
            TabBar,
            TabBarItem
        }
    }
</script>

<style scoped lang='less'>
#mainTabBar{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 49px;
    z-index: 9;
    background-color: #fff;
}
</style>
